import React, { Component } from "react";

export default class LifeCom extends Component {
  //定义状态
  state = {
    count: 100,
  };

  //组件挂载完毕之后, 自动执行, 由组件的实例对象调用
  componentDidMount() {
    // console.log(this);//值为实例对象
    console.log("完成了挂载~~");
  }

  //组件将要卸载的场景
  componentWillUnmount() {
    console.log("组件将要卸载..."); 
  }

  //组件完成更新后
  componentDidUpdate(){  
    console.log('组件完成了更新');
  }

  render() {
    return (
      <div>
        <div>生命周期的组件</div>
        <hr />
        <h2>{this.state.count}</h2>
        <button onClick={() => {
          //更新状态
          this.setState({
            count: this.state.count + 1
          })
        }}>自增</button>
      </div>
    );
  }
}
